<template>
  <div>
    <div class="topBox" v-if="companyInfos.id">
      <el-row>
        <el-col>
          <el-row>
            <el-col :span="21" class="company_title">
              <span v-if="!preview">{{ companyInfos.company }}</span>
            </el-col>
            <el-col :span="2" :offset="1">
              <el-tooltip v-if="updataType" class="item" effect="dark"
                :content="status_update == 1 ? '可更新' : '已是最新信息'" placement="bottom">
                <el-button class="item_b" type="primary" @click="update">更新</el-button>
              </el-tooltip>
            </el-col>

            <el-descriptions :labelStyle="{ fontWeight: 'bold' }" class="margin-top" title="" :column="2"
              direction="horizontal">
              <el-descriptions-item label="企业评分" :span="2">
                <div>
                  <div style="padding: 0 5px;">{{ data.percentileScore }}</div>
                  <span class="b_bule" v-for="item in tags" :key="item + '企业评分'">{{
                    item
                  }}</span>
                </div>
              </el-descriptions-item>
              <el-descriptions-item label="法定代表人" :span="2">{{
                data.legalPersonName
              }}</el-descriptions-item>
              <el-descriptions-item label="成立时间">{{
                data.estiblishTime | time
              }}</el-descriptions-item>
              <el-descriptions-item label="登记状态">{{ data.regStatus }}</el-descriptions-item>
              <el-descriptions-item label="注册资本">{{ data.regCapital }}</el-descriptions-item>
              <el-descriptions-item label="实缴资本">{{
                data.actualCapital
              }}</el-descriptions-item>
              <el-descriptions-item label="企业类型">{{
                data.companyOrgType
              }}</el-descriptions-item>
              <el-descriptions-item label="参保人数">{{
                data.socialStaffNum
              }}</el-descriptions-item>
              <el-descriptions-item label="登记机关">{{
                data.regInstitute
              }}</el-descriptions-item>
              <el-descriptions-item label="注册地址">{{ data.regLocation }}</el-descriptions-item>
              <el-descriptions-item label="人员规模" :span="2">{{
                data.staffNumRange
              }}</el-descriptions-item>
            </el-descriptions>

            <el-descriptions :labelStyle="{ fontWeight: 'bold' }" class="margin-top" title="" :column="2"
              direction="horizontal">
              <el-descriptions-item label="统一社会信用代码">{{
                data.creditCode
              }}</el-descriptions-item>
              <el-descriptions-item label="纳税人识别号">{{
                data.taxNumber
              }}</el-descriptions-item>
              <el-descriptions-item label="工商注册号">{{ data.regNumber }}</el-descriptions-item>
              <el-descriptions-item label="组织机构代码">{{
                data.orgNumber
              }}</el-descriptions-item>
            </el-descriptions>

            <el-descriptions :labelStyle="{ fontWeight: 'bold' }" class="margin-top d_boreder" title="" :column="2"
              direction="horizontal">
              <el-descriptions-item label="英文名" :span="2">{{
                data.property3
              }}</el-descriptions-item>
              <el-descriptions-item label="曾用名" :span="2">{{
                data.historyNames
              }}</el-descriptions-item>
              <el-descriptions-item label="所属行业" :span="2">{{
                data.industry
              }}</el-descriptions-item>
            </el-descriptions>

            <el-descriptions :labelStyle="{ fontWeight: 'bold' }" class="margin-top" title="" :column="2"
              direction="horizontal">
              <el-descriptions-item label="经营范围" :span="2">
                {{ data.businessScope }}
              </el-descriptions-item>
            </el-descriptions>
          </el-row>
        </el-col>
      </el-row>
    </div>

    <el-descriptions title="" :column="4" :labelStyle="labelStyle" :contentStyle="contentStyle">
      <el-descriptions-item label="邮箱" :span="2">{{
        companyInfos.email
      }}</el-descriptions-item>

      <el-descriptions-item label="联系人" :span="2">{{
        companyInfos.username
      }}</el-descriptions-item>
      <el-descriptions-item label="联系方式" :span="2">{{
        companyInfos.mobile
      }}</el-descriptions-item>
      <el-descriptions-item label="所属区域" :span="2">{{
        companyInfos.street_name
      }}</el-descriptions-item>
      <el-descriptions-item label="是否支持走访" :span="4">
        <div style="margin-left: 10px;">
          <el-radio-group v-model="visitRadio" disabled>
            <el-radio :label="1">支持走访</el-radio>
            <el-radio :label="0">拒绝走访</el-radio>
          </el-radio-group>
        </div>
      </el-descriptions-item>
      <el-descriptions-item label="公司类型" :span="4">
        <div style="margin-left: 10px;">
          <el-radio-group v-model="companyRadio" disabled>
            <el-radio :label="1">企业</el-radio>
            <el-radio :label="2">机构</el-radio>
          </el-radio-group>
        </div>
      </el-descriptions-item>
      <el-descriptions-item label="荣誉标签" :span="4">
        <div class="tagItem" v-if="infodata.label">
          <div v-for="(item, index) in infodata.label.one">
            <el-tag class="b_bule ">{{
              item.honor.name
            }}</el-tag>
          </div>
          <div v-for="(item, index) in infodata.label.three">
            <el-tag class="b_bule ">{{
              item.name
            }}</el-tag>
          </div>
          <div v-for="(item, index) in infodata.label.two">
            <el-tag class="b_bule ">{{
              item.name
            }}</el-tag>
          </div>
        </div>
      </el-descriptions-item>

      <el-descriptions-item label="企业标签" :span="4">
        <div v-if="infodata.label">
          <el-tag class="b_bule b_color" v-for="(item, index) in infodata.label.label" :key="item.name">{{
            item.name }}</el-tag>
        </div>
      </el-descriptions-item>

      <el-descriptions-item label="需求标签" :span="4">
        <div v-if="infodata.label">
          <el-tag class="b_bule b_red2" v-for="(item, index) in infodata.label.ttt_label.true_get"
            :key="item.id + '已解决'">{{ item.name }}</el-tag>
          <el-tag class="b_bule b_red" v-for="(item, index) in infodata.label.ttt_label.false_get"
            :key="item.id + '未解决'">{{ item.name }}</el-tag>
        </div>
      </el-descriptions-item>
      <el-descriptions-item label="贯标情况" :span="4">
        <el-tag class="b_bule" v-if="companyInfos.label_type == 1">未做贯标</el-tag>
        <el-tag class="b_bule" v-if="companyInfos.label_type == 2">已做贯标({{ companyInfos.endDate }})</el-tag>
        <el-tag class="b_bule" v-if="companyInfos.label_type == 3">贯标到期({{ companyInfos.endDate }})</el-tag>
      </el-descriptions-item>
      <!-- <el-descriptions-item label="未解决" :span="4">
                <div v-if="companyInfos.ttt_label">
                  <el-tag
                    class="b_bule b_red"
                    v-for="(item, index) in companyInfos.ttt_label.false_get"
                    :key="item.id + '未解决'"
                    >{{ item.name }}</el-tag
                  >
                </div>
              </el-descriptions-item> -->
    </el-descriptions>


  </div>
</template>

<script>
import { currency, tianyanchaphoneCurrency,companyTianynchaRefresh } from "@/api/newuser";
export default {
  data() {
    return {
      visitRadio: '',
      companyRadio: '',
      url: "http://open.api.tianyancha.com/services/open/ic/baseinfo/normal",
      labelStyle: {
        fontSize: "14px",
        fontWeight: "bold",
        margin: "5px 0px 0 0",
      },
      contentStyle: {
        fontSize: "14px",
        // fontWeight: 'bold'
        margin: "5px 0px 0 0",
      },
    };
  },
  watch: {
    companyInfos: {
      handler(newVal, oldVal) {
        console.log(newVal, oldVal, "newVal, oldVal");
        this.companyRadio = newVal.company_type
        this.visitRadio = newVal.is_support_visit
      },
      deep: true,
    },
  },
  filters: {
    //时间戳转换
    time(date) {
      date = new Date(date);
      var y = date.getFullYear();
      var m = date.getMonth() + 1;
      m = m < 10 ? "0" + m : m;
      var d = date.getDate();
      d = d < 10 ? "0" + d : d;
      return y + "-" + m + "-" + d;
    },
  },
  props: {
    preview: {
      type: Boolean,
      default: false,
    },
    companyInfoIndustry: {
      type: Object,
      default: () => { },
    },
    type: {
      type: String,
      default: "web",
    },
    companyInfos: {
      type: Object,
      default: () => { },
    },
    infodata: {
      type: Object,
      default: () => { },
    },
    data: {
      type: Object,
      default: () => { },
    },
    tags: {
      type: Array,
      default: () => {
        [];
      },
    },
    tokenIfon: {
      type: String,
      default: "",
    },
    status_update: {
      type: Number,
      default: 0,
    },
    updataType: {
      type: Boolean,
      default: true,
    },
  },
  components: {},
  mounted() { },
  methods: {
    companyDetails(id) {
      this.$router.push({
        path: "/companyDetails",
        query: {
          company_id: id,
        },
      });
    },
    update() {
      this.$emit("update");
      // if (this.status_update == 1) {
      //   if (this.type == "phone") {
      //     this.tianyanchaphoneCurrency();
      //     //手机端没有token验证
      //   } else {
      //     this.currency();
      //   }
      //   companyInfo({
      //     company_id: this.company_id,
      //   }).then((res) => {
      //     this.companyInfos = res;
      //   });
      // } else {
      //   this.$message.error("已是最新信息");
      // }
    },
    currency() {
      
      companyTianynchaRefresh({
        company_id:this.companyInfos.id
      }).then((res) => {
        console.log(res,'天眼查刷新');
        this.$emit("update");
      });

      // currency({
      //   url: this.url,
      //   params: JSON.stringify({
      //     keyword: this.companyInfos.company,
      //   }),
      //   inter_id: 1116,
      //   token: this.tokenIfon,
      // }).then((res) => {
      //   this.data = res;
      //   this.tags = this.data.tags.split(";");
      //   this.$emit("update");
      // });
    },
    tianyanchaphoneCurrency() {
      tianyanchaphoneCurrency({
        url: this.url,
        params: JSON.stringify({
          keyword: this.companyInfos.company,
        }),
        inter_id: 1116,
        token: this.tokenIfon,
      }).then((res) => {
        this.data = res;
        this.tags = this.data.tags.split(";");
        this.$emit("update");
      });
    },
  },
};
</script>

<style scoped lang="less">
.tagItem {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.b_bule {
  display: inline-block;
  background-color: #d3e2ff;
  margin: 3px 5px;
  border-radius: 5px;
  padding: 0px 10px;
  color: #387dff;
  font-size: 14px;
  height: 20px;
  line-height: 20px;
  cursor: pointer;
  border: none;
}

.b_red {
  color: #ff5f58 !important;
  background-color: #fff6f5 !important;
}

.pagination {
  margin-top: 20px;
}

.b_red2 {
  color: #ffffff !important;
  background-color: #ff5f58 !important;
}

.b_color {
  color: #109421 !important;
  background-color: #c2f9c9 !important;
}

.topBox {
  border-bottom: 3px solid #f4f5f7;
  margin-bottom: 20px;
}

.company_title {
  font-weight: bolder;
  font-size: 24px;
  margin-bottom: 5px;
  position: relative;

  .el-button {
    position: absolute;
    margin-left: 10px;
  }
}

@media (max-width: 1360px) {}

@media (max-width: 1280px) {}

@media (max-width: 768px) {}
</style>
